<!--
 * @Author: Freude Xu
 * @Date: 2021-10-05 17:05:02
 * @LastEditors: Freude Xu
 * @LastEditTime: 2021-10-05 17:15:37
 * @Description: 
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>事件对象</title>
    <style>
        div {
            width: 100px;
            height: 100px;
            background-color: pink;
        }
    </style>
</head>

<body>
    <div>123</div>
</body>
<script>
    var div = document.querySelector('div');
    // div.onclick = function(event) {
    //     console.log(event);
    //1.event就是一个事件对象 写到我们监听函数的小括号中，当作形参来看
    //2.事件对象只有有了事件才会存在，它是系统给我们自动创建的，不需要我们传递参数
    //3.事件对象是我们事件的一系列相关数据的集合和事件相关的，比如鼠标事件里面就包含了鼠标相关信息，鼠标坐标
    //4.ie浏览器使用window.event输出
    // }
    div.addEventListener('click', function(e) {
        console.log(e);
    })
</script>

</html>